<template>
<div class="paiThree" style="flex:1;">
         <!-- 头部导航 -->
        <wxc-minibar class="border-bottom" title="玩法说明" > </wxc-minibar>
        <!-- 头部导航end -->
        <div class="contentPai3">
             <div class="paly-title">
                <div class="line"></div>
                <text class="line-text">排列五玩法</text>
            </div>
            <div class="lottery-content">
                <text class="lottery-info">开奖时间：每日20:30开奖</text>
                <text class="lottery-info">玩法规则：00000-99999中选一个5位数为1注（2元）</text>
                <text class="lottery-info">返奖率：销售总额的53%</text>
            </div>
            <div class="lottery-term">
                <text class="win">中奖条件：</text>
                <div class="win-table">
                    <div class="win-table-list">
                        <div class="win-item">
                            <div class="min-con b-l-s min-icon1 min-he1">
                                <text class="table-con">等级</text>
                            </div>
                            <div class="min-con b-l-s min-icon2  min-he1"> 
                                <text class="table-con">说明</text>
                            </div>
                             <div class="min-con min-icon3  min-he1"> 
                                 <text class="table-con">奖金分配(举例)</text>
                            </div>
                        </div>
                         <div class="win-item ">
                            <div class="min-con b-l-s min-icon1  min-he2">
                                <text class="table-con">直选</text>
                            </div>
                            <div class="min-con b-l-s min-icon2  min-he2"> 
                                <text class="table-con">投注号码与当期公布的中奖号码的五位数按位数全部相同</text>
                            </div>
                             <div class="min-con min-icon3  min-he2"> 
                                 <text class="table-con">1040元</text>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
</div>
</template>

<script>
import WxcMinibar from "@/components/modules/wxc-minibar/index.js"


export default {
    components: { WxcMinibar},
    data() {
        return {
          list:[]
        }
    }
}
</script>
<style scoped>
 .paly-title{
        padding-top:34px;
        flex-direction:row; 
    }
    .line{
        width:6px;
        height:30px;
        background-color: #E70D0D;
        align-self: center;
    }
    .line-text{
        align-self: center;
        margin-left:22px;
        color:#E70D0D;
        font-size:32px;
         font-family: PingFangSC-Medium;
    }
.paiThree {
    width: 750px;
    position: relative;
    z-index: 2;
    background-color: rgb(242, 243, 244);
    display: flex;
    align-items: center;
}

.header-con {
	flex:1;
	height: 90px;
	display: flex;
	justify-content: center;
	position: relative;
	align-items: center;
	flex-direction: row;
}

.header-title {
  font-family: PingFangSC-Medium;
  font-size: 34px;
  color: #fff;
}

.contentPai3{
  background-color: rgb(245, 245, 245);
  
  padding-left:32px;
  padding-right: 33px;
}

.betone-title-left-hr {
  width: 6px;
  background-color: #e70d0d;
  margin-right: 10px;
  height: 30px;
  align-self: center;
}
.betone-title-left-title {
  align-self: center;
  font-size: 34px;
  color:#E70D0D;
  font-weight: 600;
 
}

.betone-title-left {
  flex-direction: row;
}

.win{
    padding-top: 30px;
    margin-bottom: 24px;
    font-size: 28px;
    color: #333;
    font-weight: 600;
}

.hotlots-title {
  justify-content: space-between;
  flex-direction: row;
}

.lottery-info{
    padding-top: 32px;
    font-size: 28px;
    color: #333;
}

.win-table-list{
  border-top-width:1px;
  border-top-style: solid;
  border-top-color: #A7A7A7;
  border-left-width:1px;
  border-left-style: solid;
  border-left-color: #A7A7A7;
  border-right-width:1px;
  border-right-style: solid;
  border-right-color: #A7A7A7;

}

.win-item{
  display: flex;
  flex-direction: row;
  justify-content: center;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #A7A7A7;
  align-items: center;
}


.table-con{
    text-align: center;
    font-size:24px;
  
}


.b-r-s {
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #A7A7A7;
}

.b-l-s {
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #A7A7A7;
}

.border-bottom{
  border-bottom-color: #f1f1f1;
  border-bottom-width: 1px;
  border-bottom-style: solid;
}
.min-icon1{
    width:104px;
}
.min-icon2{
    width:344px;
}
.min-icon3{
    width:240px;
}
.min-icon{
    padding-top:10px;
    padding-left:10px;
    padding-bottom:10px;
    padding-right:10px;
}
.min-he1{
    height:40px;
    justify-content:center;
}
.min-he2{
    height:88px;
    justify-content: center;
}
</style>

